<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<ui:composition template="/templates/template.xhtml">
	<p:growl id="growl" showDetail="true" sticky="true" />
	<ui:define name="title">
		Cadastro de Itens Produto
	</ui:define>

	<ui:define name="head">
		<style type="text/css">
#panelGrid1 {
	width: 100%;
	border-style: none;
	border-width: 0px;
}

.colunaPanelGrid1 {
	border-width: 0px;
	border-style: none;
}

.colDir {
	text-align: right;
}

.colEsq {
	text-align: left;
}

.colProduto {
	width: 400px;
}

.colValor {
	width: 70px;
}

.colQtda {
	width: 70px;
}

.ui-panelgrid td {
	border-width: 0px;
}
</style>

		<script type="text/javascript">

		$(document).ready(function(){
			  $("#chkLeitor").click(function(){
				  if($('#chkLeitor').is(':checked')) {
						$("#txtCodBarras").css("background-color","#FFFFCC");
					} else {
						$("#txtCodBarras").css("background-color","#FFF");
					}
			  });
		});


		function setarFocusLeitor(){

			if($('#chkLeitor').is(':checked')) {
				$("#txtCodBarras").focus();
			}
		}

		function desabilitarCampoLeitor(){
			$(document).focus();
		}


</script>
	</ui:define>

	<ui:define name="centro">
		<h:form id="form1" prependId="false">

			<p:panel>

				<f:facet name="header">
					<h:outputText value="#{lbls.LBL_0034}" />
				</f:facet>

				<p:panelGrid id="gridProduto" style="width:100%; border-style:none;">

					<p:row>
						<p:column>
							<p:outputLabel value="#{lbls.LBL_0040}:" for="txtCodBarras"
								style="margin-top:0px;" />
						</p:column>

						<p:column colspan="7">
							<p:inputText id="txtCodBarras" style="margin-top:0px;"
								maxlength="13" value="#{compraProdutoMB.codBarras}">
								<f:converter converterId="javax.faces.Long" />
								<p:ajax event="blur" update="gridProduto" process="txtCodBarras"
									listener="#{compraProdutoMB.codigoBarrasInformado}" />
							</p:inputText>
						</p:column>
					</p:row>

					<p:row>
						<p:column>
							<p:outputLabel value="#{lbls.LBL_0035}:" for="cmbProduto" />
						</p:column>
						<p:column colspan="5">
							<p:autoComplete id="cmbProduto" label="#{lbls.LBL_0035}"
									forceSelection="true" queryDelay="300" var="produto"
									itemLabel="#{produto.descricao}" itemValue="#{produto.id}"
									size="60" 
									value="#{compraProdutoMB.itemCompra.produto}"
									minQueryLength="3" converter="#{produtoAutoCompleteConverter}"
									completeMethod="#{compraProdutoMB.buscarProduto}" >
									<f:validateBean disabled="true" for="cmbProduto"/>
									
									
							</p:autoComplete>
									
						</p:column>

						<p:column style="border-right-style:none;">
							<div>
								<h:outputText value="#{lbls.LBL_0019}:" />
							</div>
							<div>
								<h:outputText value="#{lbls.LBL_0020}:" />
							</div>
							<div>
								<h:outputText value="#{lbls.LBL_0036}:" />
							</div>
						</p:column>
						<p:column>
							<div>
								<h:outputText id="txtQtdaMinima"
									value="#{compraProdutoMB.itemCompra.produto.qtdaMinima}" />
							</div>
							<div>
								<h:outputText id="txtQtdaMaxima"
									value="#{compraProdutoMB.itemCompra.produto.qtdaMaxima}" />
							</div>
							<div>
								<h:outputText id="txtEstoqueAtual" style="font-weight:bold;"
									value="#{compraProdutoMB.itemCompra.produto.qtdaAtualEstoque}" />
							</div>
						</p:column>
					</p:row>

					<p:row>
					
						<p:column>
							<h:outputLabel value="#{lbls.LBL_0104}:"
											for="txtCliente" />
						</p:column>
						<p:column colspan="7">
									
							<p:autoComplete id="txtCliente" label="#{lbls.LBL_0104}"
									forceSelection="true" queryDelay="300" var="cliente"
									itemLabel="#{cliente.nome}" itemValue="#{cliente.id}"
									size="60" 
									value="#{compraProdutoMB.compra.pessoa}"
									minQueryLength="3" converter="#{pessoaAutoCompleteConverter}"
									completeMethod="#{compraProdutoMB.buscarPessoa}" >
									<f:validateBean disabled="true" for="txtCliente"/>
								</p:autoComplete>
						</p:column>
					</p:row>
					<p:row>
						<p:column colspan="8" styleClass="ui-widget-header">
							<p:spacer height="0" />
						</p:column>
					</p:row>

					<p:row>
						<p:column>
							<p:outputLabel value="#{lbls.LBL_0039}:" for="txtNumLote" />
						</p:column>
						<p:column>
							<p:inputText id="txtNumLote" size="6"
								value="#{compraProdutoMB.itemCompra.lote}" />
						</p:column>

						<p:column>
							<p:outputLabel value="#{lbls.LBL_0038}:" for="txtDtValidade" />
						</p:column>
						<p:column>
							<p:calendar id="txtDtValidade" locale="pt"
								value="#{compraProdutoMB.itemCompra.dataValidade}"
								pattern="dd/MM/yyyy" size="10" showOn="button" navigator="true" />
						</p:column>

						<p:column>
							<p:outputLabel value="#{lbls.LBL_0048}:" for="txtQtda" />
						</p:column>
						<p:column>
							<p:spinner id="txtQtda"
								value="#{compraProdutoMB.itemCompra.quantidade}" min="1"
								max="10000" maxlength="5" size="2" />
						</p:column>

						<p:column>
							<p:outputLabel value="#{lbls.LBL_0069}:" for="txtValorPago" />
						</p:column>
						<p:column>
							<p:inputText size="6" id="txtValorPago" label="#{lbls.LBL_0027}"
								maxlength="9" value="#{compraProdutoMB.itemCompra.valorPago}">
								<f:convertNumber pattern="#,##0.00" minFractionDigits="2" />
							</p:inputText>
						</p:column>
					</p:row>

				</p:panelGrid>

				<f:facet name="footer">
					<p:spacer height="26" />
					<p:commandButton id="btnAddItem" icon="ui-icon-plus"
						update="itemCompraDataTable gridProduto"
						process="@this gridProduto" oncomplete="setarFocusLeitor();"
						onstart="desabilitarCampoLeitor();" style="float:right"
						value="#{lbls.LBL_0009}"
						action="#{compraProdutoMB.doAdicionarItemCompraAction}" />
				</f:facet>
			</p:panel>

			<p:spacer height="15px" />
			<p:dataTable id="itemCompraDataTable" var="itemCompra"
				paginator="true"
				currentPageReportTemplate="{currentPage} #{lbls.LBL_0065} {totalPages}"
				emptyMessage="#{lbls.LBL_0004}" paginatorPosition="bottom" rows="6"
				value="#{compraProdutoMB.listaDeItemCompra}"
				paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}">


				<p:column>
					<f:facet name="header">
						<h:outputText value="#{lbls.LBL_0035}" />
					</f:facet>
					<div align="left">
						<h:outputText value="#{itemCompra.produto.descricao}" />
					</div>
					<f:facet name="footer">
						<h:outputText value="#{lbls.LBL_0063}"
							rendered="#{not empty compraProdutoMB.listaDeItemCompra }" />
					</f:facet>

				</p:column>


				<p:column style="width:1%;">
					<f:facet name="header">
						<h:outputText value="#{lbls.LBL_0039}" />
					</f:facet>
					<div align="right">
						<h:outputText value="#{itemCompra.lote}" />
					</div>

				</p:column>

				<p:column style="width:1%;">
					<f:facet name="header">
						<h:outputText value="#{lbls.LBL_0048}" />
					</f:facet>
					<div align="right">
						<h:outputText value="#{itemCompra.quantidade}">
							<f:convertNumber pattern="00000" />
						</h:outputText>
					</div>

					<f:facet name="footer">
						<h:outputText value="#{compraProdutoMB.qtdaTotal}"
							rendered="#{compraProdutoMB.qtdaTotal ne 0}">
							<f:convertNumber pattern="00000" />
						</h:outputText>
					</f:facet>
				</p:column>

				<p:column style="width:150px;">
					<f:facet name="header">
						<h:outputText value="#{lbls.LBL_0045}" />
					</f:facet>
					<div align="right">
						<h:outputText value="#{itemCompra.valorPago}">
							<f:convertNumber type="currency" />
						</h:outputText>
					</div>

					<f:facet name="footer">
						<div align="right">
							<h:outputText value="#{compraProdutoMB.compra.valorTotal}"
								rendered="#{compraProdutoMB.compra.valorTotal ne 0}">
								<f:convertNumber type="currency" />
							</h:outputText>
						</div>
					</f:facet>

				</p:column>
				<p:column style="width:1%;">

					<p:commandButton icon="ui-icon-circle-close" id="actionButton"
						process="@this" onclick="confirmation.show()">
						<f:setPropertyActionListener
							target="#{compraProdutoMB.itemCompra}" value="#{itemCompra}" />
					</p:commandButton>
				</p:column>

			</p:dataTable>

			<p:commandButton value="#{lbls.LBL_0056}" type="button"
				style="float:right; margin-top:10px;" icon="ui-icon-check"
				onclick="confirmation2.show()" />

			<p:confirmDialog id="confirmDialog2" message="#{msgs.MSG_0026}"
				header="#{lbls.LBL_0064}" severity="alert" appendToBody="true"
				widgetVar="confirmation2">

				<p:commandButton id="confirm2" value="#{lbls.LBL_0011}"
					oncomplete="confirmation2.hide()" process="@this"
					update="gridProduto, itemCompraDataTable"
					action="#{compraProdutoMB.doSalvarAction}">
				</p:commandButton>

				<p:commandButton id="decline2" value="#{lbls.LBL_0012}"
					onclick="confirmation2.hide()" type="button" />

			</p:confirmDialog>

			<p:confirmDialog id="confirmDialog" message="#{msgs.MSG_0002}"
				header="#{lbls.LBL_0064}" severity="alert" appendToBody="true"
				widgetVar="confirmation">

				<p:commandButton id="confirm" value="#{lbls.LBL_0011}"
					update="itemCompraDataTable" oncomplete="confirmation.hide()"
					process="@this"
					action="#{compraProdutoMB.doRemoverItemCompraAction}">
				</p:commandButton>

				<p:commandButton id="decline" value="#{lbls.LBL_0012}"
					onclick="confirmation.hide()" type="button" />

			</p:confirmDialog>

		</h:form>
	</ui:define>
</ui:composition>
</html>